<template>
	<view class="repair-wrap">
		<view class="u-m-t-20 repair-box u-p-40 u-p-l-30 u-p-r-30">
			<view>
				<h3>{{classList.goods_title}}</h3>
			</view>
			<view style="display: flex;margin-top: 10px;">
				<view style="color: #666666;width: 190px;">拾取时间</view>
				<view class="text-list">{{classList.pick_time}}</view>
			</view>
			<view style="display: flex;margin-top: 10px;">
				<view style="color: #666666;width: 135px;">拾取地点</view>
				<view class="text-list">{{classList.pick_address}}</view>
			</view>
			<view style="display: flex;margin-top: 10px;">
				<view style="color: #666666;width: 289px;">联系人</view>
				<view class="text-list">{{classList.contact_person}}</view>
			</view>
			<view style="display: flex;margin-top: 10px;">
				<view style="color: #666666;width: 242px;">联系电话</view>
				<view class="text-list">{{classList.contact_phone}}</view>
			</view>
			<view style="margin-top: 10px;">
				<view>描述</view>
				<view style="color: #666666">{{classList.goods_describe}}</view>
			</view>
			
			
			<view v-if="classList.is_receive == 1" style="margin-top: 15px;">
				<view style="margin-top: 15px;">
					上传图片
					<view style="margin-top: 15px;">
						<image style="width: 100px;height: 100px;" :src="classList.goods_images" mode=""></image>
					</view>
				</view>
				<view style="display: flex;margin-top: 10px;">
					<view style="color: #666666;width: 289px;">领取人</view>
					<view class="text-list">{{classList.receive_person_name}}</view>
				</view>
				<view style="display: flex;margin-top: 10px;">
					<view style="color: #666666;width: 242px;">领取电话</view>
					<view class="text-list">{{classList.receive_person_phone}}</view>
				</view>
				<view style="display: flex;margin-top: 10px;">
					<view style="color: #666666;width: 190px;">领取时间</view>
					<view class="text-list">{{classList.begin_time}}</view>
				</view>
				<view style="margin-top: 15px;">
					身份证
					<view>
						<image style="width: 100px;height: 100px;" :src="classList.receive_id_back" mode=""></image>
					</view>
				</view>
			</view>
			<view style="margin-top: 50px;">
				<button class="yilingqu" v-if="classList.is_receive == 0" @click="datails(classList.id)">领取</button>
				<button class="bianji" v-if="classList.is_receive == 0" @click="newly(classList.id)">重新编辑</button>
				<button class="shanchu" v-if="classList.is_receive == 0" @click="deleteLo(classList.id)">删除</button>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				classList:{},
				id:null,
			}
		},
		onShow() {
			// this.getRepaireClass()
		},
		onLoad(options) {
			this.getRepaireClass(options.id)
		},
		methods: {
			// 获取报修类型
			getRepaireClass(id){
				this.$request.api.lostArticle({
					pageIndex:1,
					id:id
				}).then(res => {
					this.classList=res.data.data.datalist[0]
				});
			},
			datails(id){
				uni.navigateTo({
					url: '/pages/lostarticle/inputreceived?=id' + id
				})
			},
			//跳转编辑
			newly(id){
				uni.navigateTo({
					url: '/pages/lostarticle/newlybuild?=id' + id
				})
			},
			//删除按钮
			deleteLo(id){
				this.$request.api.deleteLost({
					id:id
				})
				uni.navigateTo({
					url: '/pages/lostarticle/lostarticle'
				})
			}
		}
	}
</script>

<style lang="scss">
	.repair-wrap {
		width: 100%;
		// min-height: 100vh;
		height: auto;
		background: #f4f4f4;
		overflow: hidden;

		.repair-box {
			background: #fff;

			.repair-titel {
				height: 44rpx;
				line-height: 44rpx;

				.repair-titel-l {
					float: left;
				}

				.repair-titel-r {
					float: right;
					color: #999;
				}
			}

			.repair-6 {
				color: #666;
			}
		}
	}
	.yilingqu{
		width: 80%;
		height: 84rpx;
		background:#F9A832;
		background-color: #F9A832;
		border-radius: 44rpx;
		line-height: 84rpx;
		color: #FFFFFF;
		text-align: center;
		font-size: 32rpx;
	}
	.shanchu{
		margin-top: 10px;
		width: 80%;
		height: 84rpx;
		line-height: 84rpx;
		background-color: #FFFFFF;
		border-radius: 44rpx;
		color: #F55959;
		border: 1rpx solid #F55959;
		text-align: center;
		font-size: 32rpx;
	}
	.bianji{
		margin-top: 10px;
		width: 80%;
		height: 84rpx;
		line-height: 84rpx;
		background-color: #FFFFFF;
		border-radius: 44rpx;
		color: #333333;
		border: 1rpx solid #cccccc;
		text-align: center;
		font-size: 32rpx;
	}
	.text-list{
		color: #000000;
		font-family: 700;
	}
</style>
